<template>
<Layout class="main-wrapper" style="min-height: 100vh">
    <Spin size="large" fix v-if="loading"></Spin> <!-- 加载动画 -->
    <Sider hide-trigger collapsible :width="216" :collapsed-width="88" v-model="collapsed" class="left-sider" v-show="!fullState">
        <app-info></app-info>
        <side-menu accordion ref="sideMenu"
        :menu-list="menuList"
        :user-info="userInfo"
        @onAlarmClick="onAlarmClick"></side-menu>
    </Sider>
    <Layout>
        <Header class="header" v-show="!fullState">
            <nav-head :user-info="userInfo"></nav-head>
        </Header>
        <Content>
            <!-- <alarm-center ref="alarmCenter"></alarm-center> -->
            <keep-alive>
                <router-view/>
            </keep-alive>
        </Content>
    </Layout>
</Layout>
</template>

<script>
import SideMenu     from './components/system/side-menu'    //右侧菜单
import AppInfo      from './components/system/app-info'     //应用信息
import NavHead      from './components/system/nav-head'     //头部导航
// import AlarmCenter  from './components/system/alarm-center' //告警中心

import { mapGetters } from 'vuex'

import getData      from 'getData'
import util         from 'util'

export default {
    components: {
        SideMenu, AppInfo, NavHead,
    },

    computed: {
        ...mapGetters(['collapsed', 'alarmShow','fullState']),
    },

    data () {
        return {
            menuList: [],
            userInfo: {},
            loading: false,
        }
    },

    methods: {
        //菜单查询
        queryMenu() {
            this.$Spin.show();
            getData.get('queryMenu').then(res => {
                this.$Spin.hide();
                if (res.status == 200 && res.data.code == '000') {
                    this.menuList = res.data.data;
                    util.localstorage.put("menu",this.menuList)
                    // localStorage.setItem('menu', JSON.stringify(this.menuList));
                } else {
                    this.$Message.error('获取菜单失败，请检查网络或联系管理员！');
                }
            });
        },
        //用户信息查询
        queryUserInfo() {
            this.$Spin.show();
            getData.get('queryUserInfo').then(res => {
                this.$Spin.hide();
                if (res.status == 200 && res.data.code == '000') {
                    this.userInfo = res.data.data;
                    this.$store.commit('setUserInfo', this.userInfo);
                } else {
                    this.$Message.error('获取用户信息失败，请检查网络或联系管理员！');
                }
            });
        },
        onAlarmClick() {
            if (!this.alarmShow) {
                this.$refs.alarmCenter.show();
            } else {
                this.$refs.alarmCenter.close();
            }
        }
    },
    created () {
        this.queryMenu();
        this.queryUserInfo();
    }
}
</script>

<style lang="less">

</style>


